<template>
    <div>
        <div class="back-color"></div>
        <div class="content">
            <div @click="goback"><i class="iconfont icon-fanhui"></i></div>
            <div class="header">
                <span>报名学员</span>
            </div>
            <div class="number">{{this.$route.params.title}}</div>
            <!--list-->
            <div class="member-list" v-for="(i, index) in allview.list" :key="index">
                <div class="head-img">
                    <img :src="i.img"/>
                </div>
                <div class="member-msg">
                    <div>{{i.truename}}</div>
                    <div>{{i.company}}&nbsp;&nbsp;&nbsp;{{i.position}}</div>
                </div>
                <div class="clear"></div>
            </div>
            <!--<div class="bot">-->
                <!--<div class="msg">-->
                    <!--点击加载更多-->
                <!--</div>-->
            <!--</div>-->
            <div style="background-color: #f3f3f3">
                <div class="tips">侃侃电商学院</div>
                <div class="feedback" @click="gofeed">问题反馈</div>
            </div>
        </div>
        <div class="bottom">
            <div @click="goIndex">更多课程</div>
            <div @click="goSign">预定报名</div>
        </div>
    </div>
</template>

<script>
import msgbox from '@/common/msgbox.js'
import { Toast } from 'mint-ui'
export default {
  name: 'member',
  data () {
    return {
      page: 1,
      allview: {
        cpunt: '',
        list: []
      }
    }
  },
  mounted () {
    this.getView()
  },
  methods: {
    goIndex () {
      this.$router.push('/')
    },
    goback () {
      this.$router.go(-1)
    },
    gofeed () {
      this.$router.push('/users/feedback')
    },
    goSign () {
      this.$router.push('/signup/' + this.$route.params.id + '/' + this.$route.params.gid)
    },
    getView () {
      let that = this
      this.$g.ajax({
        path: 'Courseorderinfos/index/' + this.$route.params.gid + '/' + this.page,
        method: 'post',
        cbSuccess: function (data) {
          that.allview = data.memo
        },
        cbError: function (data) {
          let msg = msgbox.get(data.msg)
          Toast({
            message: msg,
            position: 'bottom',
            duration: 1000
          })
        }
      })
    }
  }
}
</script>

<style scoped lang="scss">
    .back-color{
        position: absolute;
        height: 100%;
        background-color: #f3f3f3;
        width: 100%;
        z-index: 1
    }
    .icon-fanhui{
        position: absolute;
        color: #383838;
        top: 12px;
        left: 10px;
    }
    .header{
        background-color: #ffffff;
        color: #383838;
        padding: 10px 0;
        text-align: center;
    }
    .content{
        background-color: #ffffff;
        z-index: 2;
        position: relative;
        .number{
            padding: 12px 0;
            text-align: center;
            font-size: 14px;
            color: #999999;
            border-top: 3px solid #f3f3f3;
            border-bottom: 3px solid #0640a4;
        }
    }
    .member-list{
        border-top: 3px solid #f3f3f3;
        border-bottom: 3px solid #f3f3f3;
        padding: 18px;
        .head-img{
            float: left;
            img{
                width: 40px;
                height: 40px;
                border-radius: 20px;
            }
        }
        .member-msg{
            float: left;
            font-size: 14px;
            margin-left: 14px;
            div:nth-of-type(1){
                color: #383838;
            }
            div:nth-of-type(2){
                color: #999999;
            }
        }
    }
    .bot{
        background-color: #f3f3f3;
        text-align: center;
        .msg{
            width: 100px;
            background-color: #ffffff;
            color: #0640a4;
            font-size: 12px;
            padding: 12px 50px;
            margin: 0 auto;
            position: relative;
            top: 20px;
        }
    }
    .tips {
        text-align: center;
        font-size: 22px;
        font-weight: bold;
        color: #d4d8d8;
        padding-top: 40px;
    }
    .feedback{
        text-align: right;
        margin-top: 10px;
        padding-bottom: 74px;
        font-size: 12px;
        margin-right: 14px;
        color: #ababab;
    }
    .bottom{
        z-index: 2;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #ffffff;
        font-size: 14px;
        padding: 6px 0;
        div{
            padding: 10px 15.5%;
            border-radius: 5px;
        }
        div:nth-of-type(1){
            float: left;
            border: 1px solid #0640a4;
            color: #0640a4;
          margin-left: 10px;
        }
        div:nth-of-type(2){
            float: right;
            border: 1px solid #ffffff;
            color: #ffffff;
            background-color: #0640a4;
          margin-right: 10px;
        }
    }
</style>
